﻿/**********************************************************
*-----------------------------------*
* flareJ JavaScript Library
*-----------------------------------*
* 作者:Joe_Sky
* 邮箱:hitomi_doax@tom.com
* 最后更新时间:2011-8-23
*-----*-----*-----*-----*-----*-----*
* 基于jQuery
***********************************************************/

/*----------------------------------------------*
* flareJ.ToolTip
*-------*-------*-------*-------*-------*-------*
* 悬停提示
*-------*-------*-------*-------*-------*-------*
* (必须)需引入flareJ.Base.js
* (必须)需引入flareJ.Panel.js
*----------------------------------------------*/
(function ($) {
    var FJ = $.flareJ, flareJ = FJ;

    /************************************************************
    *-----------------------------------------------------------*
    *                         悬停提示
    *-----------------------------------------------------------*
    *************************************************************
    *-----*-----*-----*-----*-----*-----*-----*-----*-----*-----*
    * 
    *-----*-----*-----*-----*-----*-----*-----*-----*-----*-----*
    * 调用方法:$("tagname").TTJ();
    ************************************************************/
    this.ToolTipJ = this.TTJ = FJ.ToolTipJ = FJ.TTJ = FJ.PJ.extend({
        //#region 构造方法
        init: function (elemObj, settings) {
            //设置参数
            this._super(elemObj, $.extend(true, {
                fjType: "TTJ",
                renderTo: "body",                          //要加载到的容器
                hoverDirect: "top",                                 //悬停层弹出方向
                hoverSpeed: 777,                                    //悬停层关闭延迟时间
                hoverName: "fdHover" + new Date().getTime(),        //悬停层名
                hoverType: "over",                                   /*-------*弹出方式*-------*
                                                                      * over:鼠标移上
                                                                      * focus:获得焦点
                                                                      * free:随意
                                                                      *-----*-----*-----*-----*/
                shiftLeft: 0,                                       //弹出位置偏移值(横)
                shiftTop: 0,                                        //弹出位置偏移值(纵)
                onlyFirstLoad: null,                                //是否只有第一次显示时加载内容页
                borderWidth: 1,                                     //边框宽度
                borderWidthB: 0,                                    //内容层边框宽度
                isHoverShow: true,                                  //悬停层是否正在显示
                isBodyEmpty: false,                                 //显示时是否先清空内容层
                showType: "fade",                                   //弹出效果
                showLoading: true,
                loadSpeed: 200,
                loadDomType: "html",
                imgLoadSrc: PJ.imgFolderSrc + "loading3.gif",      //Loading条图片路径
                cbB: null,                                          //内容加载完毕回调方法
                showHead: false,                           //是否显示头部
                showFoot: false,                           //是否显示底部
                showSpeed: 500,                              //显示、隐藏速度
                hasIfr: true,
                radius: 0,                                          //圆角弧度
                colorParams: {                                      //颜色参数
                    borderIn: "#009ac9"                             //内层边框
                },
                eType: (function(j){
                    return {
                        afterrender: j,                             //加载完毕
                        aftershow: j,                             //显示完毕
                        afterbodyload: j                          //内容加载完毕
                    }
                })("TTJ")
            }, settings));

            //悬停层延迟时间对象
            this.timeOut = null;

            //初始化悬停层标记
            this.hoverId = null;

            return this;
        },
        //#endregion

        //#region 初始化
        initFn: function () {
            this._super();
        },
        //#endregion

        //#region 构建
        create: function () {
            var thiz = this;
            this._super();

            //外层
            this.divOut.attr("id", "TTJ_" + this.p.hoverName).css({
                position: "absolute",
                backgroundColor: this.p.colorParams.bgColor
            });

            //设置圆角
            if(this.radiusStyle && this.p.radius > 0){
                this.pjBody.css(this.radiusStyle, this.p.radius);
                this.bodyIn.css(this.radiusStyle, this.p.radius);
            }

            //是否显示头部
            if(this.p.showHead){
                //禁止最小化
                this.pjBtnMin.hide();

                //关闭事件
                this.pjBtnClose.unbind("click").click(function () {
                    var sp = thiz.p.hoverSpeed;
                    thiz.p.hoverSpeed = 0;
                    thiz.close($("#" + thiz.hoverId));
                    thiz.p.hoverSpeed = sp;
                });
            }

            //为弹出层,选中的元素集合注册事件
            this.bindEvent();

            //初始化动画
            var _AJ;
            switch (this.p.showType) {
                case "minToMax":   //由小变大
                    _AJ = AJ_fly;
                    break;
                case "fade":   //淡入淡出
                    _AJ = AJ_easing;
                    break;
            }

            this.aj = new _AJ(this.divOut, {
                speed: this.p.showSpeed,
                speed2: this.p.speed > 1 ? 70 : 1,
                sa: {
                    width: this.p.widthF,
                    height: this.p.heightF,
                    left: this.p.leftF,
                    top: this.p.topF
                },
                cbS: function(){
                    //显示完毕事件
                    thiz.fire("aftershow", {elem:thiz.hoverElement}, "TTJ");

                    if (thiz.p.onlyFirstLoad == null) {
                        thiz.loadHover();
                    }
                    else {
                        if (thiz.p.onlyFirstLoad) {
                            thiz.p.onlyFirstLoad = false;
                            thiz.loadHover();
                        }
                    }
                },
                cbC: function(){
                    //初始化悬停层标记
                    thiz.hoverId = null;
                    thiz.overByFocus = false;
                    //执行回调函数
                    if (thiz.p.callbackC != null) {
                        thiz.p.callbackC();
                    }
                }
            });

            this.fire("afterrender", "TTJ");

            return this;
        },
        //#endregion

        //#region 显示
        show: function (hoverElement) {
            var thiz = this;

            //检测是否可以显示
            if (this.p.isHoverShow) {
                var thiz = this;
                var hoverId = hoverElement.attr("id");
                //判断层是否正为该元素显示
                if (this.hoverId != hoverId) {
                    this.hoverId = hoverId;
                    //先清空内容层
                    if (this.p.isBodyEmpty) {
                        this.bodyIn.empty();
                    }
                    //获取选中元素边距
                    var offsetH = hoverElement.offset();
                    //使内容页滚动条到顶部
                    this.bodyIn[0].scrollTop = 0;

                    //#region 弹出动画参数
                    var showAnimate = {};
                    showAnimate.width = this.p.widthF;
                    showAnimate.height = this.p.heightF;
                    switch (this.p.hoverDirect) {
                        case "top":   //在下面显示
                            showAnimate.left = (offsetH.left + hoverElement[0].offsetWidth / 2 - this.p.widthF / 2 + this.p.shiftLeft);
                            showAnimate.top = (offsetH.top - hoverElement[0].offsetHeight / 2 - this.p.heightF - 5 + this.p.shiftTop);
                            break;
                        case "right": //在右侧显示
                            showAnimate.left = (offsetH.left + hoverElement[0].offsetWidth + this.p.shiftLeft);
                            showAnimate.top = (offsetH.top - hoverElement[0].offsetHeight + this.p.shiftTop);
                            break;
                        case "bottom": //在下面显示
                            showAnimate.left = (offsetH.left + hoverElement[0].offsetWidth / 2 - this.p.widthF / 2 + this.p.shiftLeft);
                            showAnimate.top = (offsetH.top + hoverElement[0].offsetHeight / 2 + this.p.shiftTop);
                            break;
                        case "left": //在左侧显示
                            showAnimate.left = (offsetH.left - hoverElement[0].offsetWidth + this.p.shiftLeft);
                            showAnimate.top = (offsetH.top - hoverElement[0].offsetHeight + this.p.shiftTop);
                            break;
                        case "fixed": //在固定位置显示
                            showAnimate.left = this.p.leftF + this.p.shiftLeft;
                            showAnimate.top = this.p.topF + this.p.shiftTop;
                            break;
                    };
                    //#endregion

                    if (FJ.isIE6) {
                        var sa = FJ.clone(showAnimate);
                        sa.width += 8;
                        sa.height += 8;
                        this.showIfr(true, sa);
                    }

                    //显示
                    this.aj.hoverElement = hoverElement;
                    switch (this.p.showType) {
                        case "minToMax":   //由小变大
                            this.aj.alterP({
                                sa: {
                                    width: showAnimate.width,
                                    height: showAnimate.height,
                                    left: showAnimate.left,
                                    top: showAnimate.top,
                                    leftO: offsetH.left + hoverElement[0].offsetWidth / 2,
                                    topO: offsetH.top + hoverElement[0].offsetHeight / 2 - 10
                                }
                            });
                            break;
                        case "fade":   //淡入淡出
                            this.aj.alterP({
                                sa: showAnimate
                            });
                            break;
                    }
                    this.aj.go("s");
                }
            }
        },
        //#endregion

        //#region 关闭
        close: function (hoverElement) {
            //检测是否可以显示
            if (this.p.isHoverShow) {
                var thiz = this;
                var offsetH = hoverElement.offset();

                //延迟一定时间后关闭
                this.timeOut = setTimeout(function () {
                    if (FJ.isIE6) {  //IE6下隐藏iframe
                        thiz.showIfr(false);
                    }
                    //鼠标移开时收回
                    switch (thiz.p.showType) {
                        case "minToMax":   //由小变大
                            break;
                        case "fade":   //淡入淡出
                            thiz.aj.alterP({
                                sa: {
                                    width: parseFloat(thiz.divOut.css("width")),
                                    height: parseFloat(thiz.divOut.css("height")),
                                    left: parseFloat(thiz.divOut.css("left")),
                                    top: parseFloat(thiz.divOut.css("top"))
                                }
                            });
                            break;
                    }
                    thiz.aj.go("c");
                }, thiz.p.hoverType == "over" ? thiz.p.hoverSpeed : 0);
            }
        },
        //#endregion

        //#region 绑定鼠标事件
        bindEvent: function () {
            var thiz = this;

            if (FJ.isIE) {        //IE
                this.bindEventFn();
            }
            else {                       //FF、Chrome
                setTimeout(function () {
                    thiz.bindEventFn();
                }, 5);
            }
        },
        //#endregion

        //#region 绑定鼠标事件方法
        bindEventFn: function () {
            var thiz = this;

            //选中的元素集合
            var bindObj;
            if (this.p.selCondition != null) {
                bindObj = $(this.p.selCondition);
            }
            else {
                bindObj = this.p.obj;
            }
            this.bindObj = bindObj;

            if(this.p.hoverType != "free"){
                //层
                this.divOut.bind("mouseenter", function () {
                    clearTimeout(thiz.timeOut);
                    if (thiz.p.hoverType == "focus") {
                        thiz.overByFocus = true;
                    }
                }).bind("mouseleave", function () {
                    if(thiz.p.hoverType != "focus") {
                        clearTimeout(thiz.timeOut);
                        thiz.close($("#" + thiz.hoverId));
                    }
                    else{
                        thiz.overByFocus = false;
                        if(!thiz.closeByFocus)
                            thiz.currentObj.focus();
                    }
                });

                var event1, event2;
                switch (this.p.hoverType) {
                    case "over":   //移上
                        event1 = "mouseenter";
                        event2 = "mouseleave";
                        break;
                    case "focus":  //获得焦点
                        event1 = "focus";
                        event2 = "blur";
                        this.overByFocus = false;  //判断鼠标是否进入过层内
                        break;
                }

                bindObj.bind(event1, function () {
                    thiz.closeByFocus = false;
                    clearTimeout(thiz.timeOut);
                    thiz.currentObj = $(this);
                    thiz.show($(this));
                });
                if (event2 != null) {
                    bindObj.bind(event2, function () {
                        if (thiz.p.hoverType != "focus") {
                            clearTimeout(thiz.timeOut);
                            thiz.close($(this));
                        }
                        else {
                            if (!thiz.overByFocus) {
                                thiz.closeByFocus = true;
                                clearTimeout(thiz.timeOut);
                                thiz.close($(this));
                            }
                        }
                    });
                }
            }
        },
        //#endregion

        //#region 显示/隐藏
        setVisible: function (isShow) {
            clearTimeout(this.timeOut);
            if (isShow) {
                this.show(this.bindObj.eq(0));
            }
            else {
                this.close(this.bindObj.eq(0));
            }
        },
        //#endregion

        //#region 加载内容页完毕回调函数
        loadBodyCB: function () {
            this.showLoad(false);
            
            //内容加载完毕事件
            this.fire("afterbodyload", "TTJ");

            this.fixBody();
        },
        //#endregion

        //#region 载入内容页
        loadHover: function (url) {
            if (url != null) { this.p.bodyUrl = url; }  //修改内容层url
            this.loadBody();
            return this;
        },
        //#endregion

        //#region 删除
        remove: function () {
            this.divOut.remove();
            if (FJ.isIE6) {
                this.pjIframe.remove();
            }
        }
        //#endregion
    });

    //#region 绑定到jquery
    $.fn.extend({
        ToolTipJ: function (settings) {
            return new FJ.ToolTipJ(this, settings);
        },
        TTJ: function (settings) {
            return $(this).ToolTipJ(settings);
        },
        HoverDivJ: function (settings) {
            return $(this).ToolTipJ(settings);
        },
        HDJ: function (settings) {
            return $(this).ToolTipJ(settings);
        }
    });
    //#endregion

    //#region 保留旧版本的对象名
    this.HoverDivJ = this.HDJ = FJ.HoverDivJ = FJ.HDJ = FJ.TTJ;
    //#endregion

})(jQuery);